<template>
	<view >
		<uni-popup ref="popup"  type="bottom"  @change="popChange">
			<view class="pop-view">
				<view class="gbp-info-view">
					<image class="gbp-info-img" :src="goodBean.image"></image>
					<view class="gbp-info-txt-view">
						<view class="gbp-title">
							<text class="gbp-title-tag">{{goodBean.label==='0'?'活动':'热卖'}}</text>
							<text class="gbp-title-txt">{{goodBean.name}}</text>
						</view>
						<text class="gbp-desc">{{goodBean.sub}}</text>
						<text class="gbp-price">¥{{goodsPrice}}</text>
					</view>
				</view>
				<text class="gbp-choose-txt" v-if="goodBean.sku.length>0">请选择</text>
				<view v-if="goodBean.sku.length>0" class="gbp-sku-view"  v-for="(item,index) in goodBean.sku" :key="index">
					<view v-for="(itemInner,indexInner) in item.list" :key="indexInner"
					 :class="[item.list[indexInner].isSelect?'gbp-sku-item-select':'gbp-sku-item']"
					 :style="indexInner%3==1||indexInner%3==2?'margin-left: 9px':'margin-left: 0px'" @click="lebalSelect"
					 :data-index="index+'-'+indexInner">{{itemInner.sku_name}}</view>
				</view>
				<view class="gbp-count-view">
					<text class="gbp-count-desc" style="flex: 1;">数量</text>
					<view class="gbp-count-jisuan-veiw">
						<text class="gbp-count-sub" @click="goodsSub">-</text>
						<text class="gbp-count">{{goodsCount}}</text>
						<text class="gbp-count-add" @click="goodsAdd">+</text>
					</view>
				</view>
				<view class="bottom-pay-btn-view">
					<view class="btn-view">
						<image class="bottom-pay-btn-bg" src="http://c.shiqin.wang/photo/buy.png"></image>
						<text class="pay-price">应付金额：¥{{payPrice}}</text>
						<text class="pay-btn" @click="payOrderClick">立即购买</text>
					</view>
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	export default {
		name: "goods-buy-pop",
		props: {
			isShow:false,
			dataSource:Object,
		},
		watch: {
			isShow(val) {
				if(val){
					this.$refs.popup.open()
					this.goodBean=this.$props.dataSource
					this.goodsCount=1
					this.skuId=""
					this.skuPrice=this.goodBean.price
					this.goodsPrice=this.goodBean.price
					if(this.goodBean.sku.length==0){
						this.payPrice=this.skuPrice*this.goodsCount
					}else{
						for (var i = 0; i < this.goodBean.sku.length; i++) {
							for (var j = 0; j < this.goodBean.sku[i].list.length; j++) {
								this.goodBean.sku[i].list[j].isSelect=false
							}
						}
						this.payPrice=0.00
					}
				}
			}
		},
		data() {
			return {
				goodBean:{},
				goodsCount:1,
				goodsPrice:"",
				payPrice:0.00,
				skuPrice:0.00,
				skuId:"",
			};
		},
		methods:{
			lebalSelect:function(e){
				var item=e.currentTarget.dataset.index.split('-')
				var index=item[0]
				var indexIndex=item[1]
				var data=JSON.parse(JSON.stringify(this.goodBean))
				for (var j = 0; j < data.sku[index].list.length; j++) {
					if(indexIndex==j){
						data.sku[index].list[j].isSelect=true
					}else{
						data.sku[index].list[j].isSelect=false
					}
				}
				this.goodBean=data
				this.getPrice()
			},
			getPrice:function(){
				var ids=[]
				var selectCount=0
				for (var i = 0; i < this.goodBean.sku.length; i++) {
					for (var j = 0; j < this.goodBean.sku[i].list.length; j++) {
						if(this.goodBean.sku[i].list[j].isSelect){
							ids.push(this.goodBean.sku[i].list[j].id)
							selectCount=selectCount+1
						}
					}
				}
				var idString=""
				for (var i = 0; i < ids.length; i++) {
					 if(i==0){
						idString=ids[i]
					}else{
						idString=idString+"-"+ids[i]
					}
				}
				var isExit=false
				var goodPrice;
				for (var i = 0; i < this.goodBean.skupriceArr.length; i++) {
					if(this.goodBean.skupriceArr[i].sku_info==idString){
						goodPrice=this.goodBean.skupriceArr[i].price
						isExit=true;
						this.skuId=this.goodBean.skupriceArr[i].id
					}
				}
				if(selectCount==this.goodBean.sku.length){
					if(!isExit){
						goodPrice=this.goodBean.price
					}
					this.skuPrice=goodPrice
					this.payPrice=goodPrice*this.goodsCount
					if(this.goodBean.sku.length>0){
						this.goodsPrice=goodPrice*this.goodsCount
					}
				}else{
					this.payPrice=0
				}
			},
			goodsSub:function(){
				if(this.goodsCount>1){
					this.goodsCount=this.goodsCount-1
					this.getPrice()
				}
			},
			goodsAdd:function(){
				this.goodsCount=this.goodsCount+1
				this.getPrice()
			},
			popChange:function(e) {
				if(!e.show){
					var obj = {
						isclose: false,
					};
					this.$emit('returnGoodsBuyPop', obj);
				}
			},
			payOrderClick:function(){
				var user = uni.getStorageSync("shiqin-user")
				if (!user.PQD) {
					uni.navigateTo({
						url:"../../pages/index/index"
					})
					return
				}
				var selectCount=0
				for (var i = 0; i < this.goodBean.sku.length; i++) {
					for (var j = 0; j < this.goodBean.sku[i].list.length; j++) {
						if(this.goodBean.sku[i].list[j].isSelect){
							selectCount=selectCount+1
						}
					}
				}
				if(selectCount==this.goodBean.sku.length){
					var obj = {
						isclose: false,
						goodData:this.goodBean,
						goodsCount:this.goodsCount,
						skuId:this.skuId,
						goodGGPrice:this.skuPrice,
						tag:"123"
					};
					this.$emit('returnGoodsBuyPop', obj);
					this.$refs.popup.close();
				}else{
					uni.showToast({
						title:"请选择规格",
						icon:"none"
					})
				}
			}
		}
	}
</script>

<style>
	@import "goods-buy-pop.css";
</style>
